<script setup>
import { computed } from 'vue';

let props = defineProps(['msg','type']);

let color = {info:'#3f0',warn:'#f66',error:'#c00'};

let ys = computed(()=>{
    return {backgroundColor:color[props.type]};
})
</script>


<template>
<div class="box" :style="ys">
    {{ msg }}
</div>
</template>

<style scoped>
.box{
    display: inline-block;
    padding: 5px;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    border-radius: 5px;
    opacity: 0.8;
}

</style>